//
// Variables
// --------------------------------------------------

// Colors
//
$body-bg: #fff !default;
$body-color: #333 !default;

// Create grayscale
$gray-dark:                 #292b2c !default;
$gray:                      #464a4c !default;
$gray-light:                #636c72 !default;
$gray-lighter:              #eceeef !default;
$gray-lightest:             #f7f7f9 !default;

// Fonts
//
$font-family-base: -app-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !default;

$font-size-base: 16px !default;
$line-height-base: 1.5 !default;

// Components
// 
// Define common padding and border radius sizes and more.

$border-radius-base: 4px !default;

// Base
//
$body-max-width: 640px !default;

// Media
//
$media-chat-bg: #f8f8f8 !default;
$media-chat-hd-size: 36px !default;
$media-chat-hd-line-height: $media-chat-hd-size !default;

$media-chat-title-font-size: 14px !default;
$media-chat-title-color: $gray-light !default;
$media-chat-title-line-height: $line-height-base !default;
$media-chat-desc-font-size: 16px !default;
$media-chat-desc-color: $gray !default;

$media-card-bg: #fff !default;
$media-card-padding: 10px !default;
$media-card-border-color: #dedede;
$media-card-border-radius: $border-radius-base !default;

$media-card-title-font-size: $font-size-base !default;
$media-card-title-color: $media-chat-desc-color !default;

$media-card-desc-font-size: $media-card-title-font-size - 4 !default;
$media-card-desc-color: #999 !default;

$media-card-thumb-size: 48px !default;

$media-card-ft-font-size: $media-card-desc-font-size - 2 !default;
$media-card-ft-color: $media-card-desc-color !default;

$media-recommendation-hd-size: 60px !default;

// Pagination
//
$pagination-item-size: 40px !default;
$pagination-item-border-radius: $border-radius-base !default;
$pagination-item-bg: #f8f8f8 !default;
$pagination-item-color: #09BB07 !default;


